<script setup lang="tsx">
import { ref } from 'vue';
import { wipPlancaption, wipPlanprocess } from '@/service/api/modules/scheduling';
interface Emits {
  (e: 'search', model: any): void;
  (e: 'reset', model: any): void;
}

const emit = defineEmits<Emits>();

const model = defineModel<any>('model', { required: true });

function search() {
  emit('search', model.value);
}

const productionProcesseslist = ref([]);
function getPro() {
  wipPlanprocess().then(({ data, error }) => {
    if (!error) {
      productionProcesseslist.value = data;
    }
  });
}
const orderstatusList = ref([
  { value: 1, name: '正常' },
  { value: 2, name: '重工' },
  { value: 3, name: '库存重工' },
  { value: 4, name: '外发' },
  { value: 5, name: '暂停' },
  { value: 6, name: '取消' }
]);

getPro();
function reset() {
  model.value.moduleNo = null;

  // model.value.state = ;

  // model.value.time = ['', ''];
  emit('reset', model.value);
}
</script>

<template>
  <ACard :title="null" :bordered="false" class="search-card card-wrapper">
    <AForm
      :model="model"
      :label-col="{
        span: 5,
        md: 7
      }"
      class="search-form"
    >
      <div class="w-full flex">
        <ARow :gutter="[15, 8]" wrap class="w-full">
          <ACol :span="24" :md="12" :lg="6" :xl="8" :xxl="6">
            <AFormItem label="产品型号" name="moduleNo" class="m-0" :label-col="{}">
              <AInput
                v-model:value="model.moduleNo"
                placeholder="请输入产品型号"
                class="min-form-control"
                allow-clear
                autocomplete="off"
                @keypress.enter="search"
              />
            </AFormItem>
          </ACol>
          <ACol :span="24" :md="12" :lg="6" :xl="6" :xxl="6">
            <AFormItem label="状态" name="wipState" class="m-0" :label-col="{}">
              <ASelect v-model:value="model.state" placeholder="请选择工单状态" class="min-form-control" allow-clear>
                <ASelectOption v-for="item in orderstatusList" :key="item.value" :value="item.name">
                  {{ item.name }}
                </ASelectOption>
              </ASelect>
            </AFormItem>
          </ACol>

          <ACol :span="24" :md="12" :lg="6" :xl="6" :xxl="6">
            <AFormItem label="日期" name="time" class="m-0" :label-col="{}">
              <ARangePicker v-model:value="model.time" value-format="YYYY-MM-DD" class="min-form-control" />
            </AFormItem>
          </ACol>
          <div class="flex">
            <AFormItem class="m-0">
              <div class="w-full flex-y-center justify-end gap-12px">
                <AButton type="primary" ghost class="mini-btn" @click="search">
                  <template #icon>
                    <icon-ic-round-search class="align-sub text-icon" />
                  </template>
                  <span class="ml-3px">{{ $t('common.search') }}</span>
                </AButton>
                <AButton class="mini-btn" @click="reset">
                  <template #icon>
                    <icon-ic-round-refresh class="align-sub text-icon" />
                  </template>
                  <span class="ml-3px">{{ $t('common.reset') }}</span>
                </AButton>
              </div>
            </AFormItem>
          </div>
        </ARow>
      </div>
    </AForm>
  </ACard>
</template>

<style></style>
